<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>

<body>
    <img id="light" src="img/off.gif"> <br>

    <div class="cls">传智教育</div> <br>
    <div class="cls">黑马程序员</div> <br>

    <input type="checkbox" name="hobby"> 电影
    <input type="checkbox" name="hobby"> 旅游
    <input type="checkbox" name="hobby"> 游戏
    <br>
    <script>
        //1. 点亮灯泡 改变 src 的属性值
        //获取img对象
        var img = document.getElementById('light');
        img.src = "img/on.gif";

        //2. 将所有的 div 标签的标签体内容替换为 非常好
        //获取所有的div标签，转换为对象并存入数组中
        var divs = document.getElementsByClassName('cls');
        for(let i = 0;i < divs.length ; i++){
            const div = divs[i];
            div.innerHTML += "<font color = 'red'>very good</font>";
        }

        //3. 使所有的复选框呈现被选中的状态
        var ins = document.getElementsByName('hobby');
        for(let i = 0;i < ins.length ; i++){
            check = ins[i];
            check.checked = true;//选中
        }
    </script>
</body>

</html>